.col_1 {
  width: 100%;
  height: 40px;
  line-height: 40px;
  text-align: center;
  background: #52c41a;
}
.col_2 {
  width: 100%;
  height: 40px;
  line-height: 40px;
  text-align: center;
  background: #13c2c2;
}
.col_3 {
  width: 100%;
  height: 40px;
  line-height: 40px;
  text-align: center;
  background: #1890ff;
}

.col_4 {
  width: 100%;
  height: 40px;
  line-height: 40px;
  text-align: center;
  background: #fa541c;
}

.col_offset1 {
  width: 100%;
  height: 150px;
  line-height: 150px;
  text-align: center;
  background: #52c41a;
  border-radius: 10px;
}

.col_offset2 {
  width: 20%;
  height: 40px;
  line-height: 40px;
  text-align: center;
  background: #1890ff;
  margin-top: 10px;
  border-radius: 10px;
  display: inline-block;
}

.col_offset3 {
  width: 20%;
  height: 40px;
  line-height: 40px;
  text-align: center;
  background: #fa541c;
  margin-top: 10px;
  border-radius: 10px;
  display: inline-block;
  margin-left: 8px;
}

.col_flex_1 {
  width: 100%;
  height: 40px;
  line-height: 40px;
  text-align: center;
  background: #1890ff;
}
.col_flex_2 {
  width: 100%;
  height: 40px;
  line-height: 40px;
  text-align: center;
  background: #fa541c;
}
